/*****************************************************
*
*     Imports
*
******************************************************/


// Activate imports for compiling !!!

//
// UIKit Core
//
@import "../src/less/uikit.less";

//
// Ian Lunn CSS Hover
//
//@import "../../lib/css/ian-lunn/hover.less";


//
// Stageone Customizings
//
@import "../../lib/css/so-uikit-config.less";
@import "../../lib/css/so-less-lib.less";
@import "../../lib/css/so-css-plugins.less";
@import "../../lib/css/so-template-base-styles.less";



/*****************************************************
*
*     Stageone Template
*
******************************************************/

a, .uk-link, .uk-button {
  .transition();
}

.uk-light,
.uk-section-primary:not(.uk-preserve-color),
.uk-section-secondary:not(.uk-preserve-color),
.uk-tile-primary:not(.uk-preserve-color),
.uk-tile-secondary:not(.uk-preserve-color),
.uk-card-primary.uk-card-body,
.uk-card-secondary.uk-card-body,
.uk-offcanvas-bar {
  a {
    color: @inverse-global-link-color;
    &:hover {
      color: @inverse-global-link-hover-color;
    }
  }
}

.uk-button-text, .uk-button-default, .uk-button-primary, .uk-button-secondary {
  padding-top:@form-button-padding-vertical;
  padding-bottom:@form-button-padding-vertical;
  text-transform: uppercase;
  .fontMedium();
}

.uk-card-title {
  .fontBold();

}

h4, .uk-h4 {
  .fontBold();
  text-transform: none;
}

.uk-heading-small {
  .fontExtraBold();
  color:@color-a;
  margin-top:8px;
}

// Optional button border
.uk-button-default, .uk-button-primary, .uk-button-secondary {
  border:@global-medium-border-width solid @global-link-color;
  &:hover {
    border:@global-medium-border-width solid @global-link-hover-color;
  }
}

.uk-button-default {
  border-color:@button-default-background;
  &:hover {
    border-color:@button-default-hover-background;
  }
}

.uk-button-primary {
  border-color:@button-primary-background;
  &:hover {
    border-color:@button-primary-hover-background;
  }
}

.uk-button-secondary {
  border-color:@button-secondary-background;
  &:hover {
    border-color:@button-secondary-hover-background;
  }
}

// Inverse Button
.uk-light .uk-button-default, .uk-light.uk-button-default {
  border-color:@inverse-button-default-background;
  &:hover {
    border-color:@inverse-button-default-hover-background;
  }
}

.uk-light .uk-button-primary, .uk-light.uk-button-primary {
  border-color:@inverse-button-primary-background;
  &:hover {
    border-color:@inverse-button-primary-hover-background;
  }
}

.uk-light .uk-button-secondary, .uk-light.uk-button-secondary {
  border-color:@inverse-button-secondary-background;
  &:hover {
    border-color:@inverse-button-secondary-hover-background;
  }
}

.uk-light .uk-button-text, .uk-button-text.uk-light,
.uk-light .uk-button-link, .uk-button-link.uk-light {
  color: @inverse-global-emphasis-color;
  &:hover {
    color: @inverse-global-link-hover-color;
  }
}

.uk-light .uk-card-title, .uk-card-title.uk-light {
  color: @inverse-global-emphasis-color !important;
}




.uk-list-bullet > li {
  position:relative;
}
.uk-list-bullet > ::before {
  position:absolute;
  left:0;
  height:30px;
}

.cover-top {
  .coverPosition(50%,0);
}

.background-gradient {
  .gradient();
}

.background-pattern {
  background-repeat: no-repeat;
  .pattern-container {

  }
}


@spacer-width: 18px;

#bottom-spacer, #left-spacer, #right-spacer, #top-spacer {
  z-index: @global-z-index + 10000;
  position: fixed;
  background: @color-a;
}

#snd-top-spacer, #snd-bottom-spacer {
  z-index: @global-z-index + 10001;
  position: fixed;
  height: @spacer-width;
  width:100%;
  background: @color-base-e;
}

#left-spacer, #right-spacer {
  top: 0;
  bottom: 0;
  width: @spacer-width;
}

#top-spacer, #bottom-spacer, #snd-top-spacer, #snd-bottom-spacer {
  height: @spacer-width;
  width:100%;
}

#top-spacer, #snd-top-spacer {
  top: 0;
}

#bottom-spacer, #snd-bottom-spacer {
  bottom: 0;
  height: @spacer-width;
}

#left-spacer {
  left:0;
}

#right-spacer {
  right:0;
}



//
// phone portrait
//

.icon-square {
  width:35px;
  height:35px;
  margin-left:5px;
  margin-right:5px;
  background:@color-a;
  color:@global-inverse-color;
  border-radius: @global-border-radius;

  &:hover {
    background:@global-link-hover-color;
    color:@global-inverse-color;
  }

  &#share-facebook:hover {
    background:#3c5a9c;
    color:@global-inverse-color;
  }

  &#share-twitter:hover {
    background:#59ccfd;
    color:@global-inverse-color;
  }

  &#share-instagram:hover {
    background:#e83083;
    color:@global-inverse-color;
  }
  &#share-xing:hover {
    background:#0b6163;
    color:@global-inverse-color;
  }
  &#share-linked-in:hover {
    background:#1178b3;
    color:@global-inverse-color;
  }
  &#share-youtube:hover {
    background:#dc001f;
    color:@global-inverse-color;
  }

}


.lang-navbar-container {
  padding:0 65px 0 0;
}

.lang-button {
  background:transparent;
  color:@color-base-e;
  border:1px solid @color-base-e;
  border-radius:0;
  &.uk-open {
    background:@color-base-e;
    color:@color-a;
  }

}

#lang-dropdown {
  background:@color-base-e;
  min-width:auto;
  padding:10px;
  > a {
    display:block;
    color:@color-a;
    padding:4px 25px;
    text-decoration: none;
  }
}

#short-message {
  .transition();
  position:absolute;
  left:-300px;
  top: 20vh;
  width:300px;
  .msg-content {
    display:inline-block;
  }

  .msg-button {
    transform-origin: top right;
    display:inline-block;
    position:absolute;
    right:1px;
    top:-5px;
    padding:0 5px 5px 5px;
    overflow:hidden;
    cursor:pointer;
  }

  &.is-open {
    left:0;
  }
}


.offset-bottom {
  .transform(translate(0, 40px));
}

#footer.uk-light {
  color:@color-base-e;
  a {
    .transition();
    color:@color-base-e;
    opacity: 0.75;
    &:hover {
      opacity: 1;
    }
  }
}
.uk-navbar-toggle {
  height: @mobile-header-height;
}

/*
#header,
.uk-navbar-container,
.uk-navbar-nav > li > a,
.uk-navbar-item,



.header-fixed-active {

  #header {
    //background:@color-a;
    color:@global-inverse-color;
    //border-bottom:@global-border-width solid @global-border;
    .boxShadow();
  }

  .uk-navbar-dropdown {
    top: @navbar-nav-item-height !important;
  }

  #main-navigation.uk-navbar-nav > li.level-1 {
    > a {
      &:before {
        top: 20px;
      }
    }
  }
}

*/


.uk-navbar-toggle {
  padding:0 38px 0 0;
}

#metafooter {
  .uk-h3 {
    .fontMedium();
  }
  .uk-icon {
    vertical-align: 3px;
  }
  .uk-heading-divider {
    border-width: @global-border-width;
    border-bottom-color:@color-white !important;
  }
  .uk-list-divider > :nth-child(n+2) {
    border-top-color:rgba(255,255,255,0.25) !important;
  }
}


#contactFrame {
  .contact.row:first-child {
    margin-top:10px !important;
  }
}

.uk-input, .uk-textarea, .uk-select {
  .transition();
  border:@global-border-width solid @global-muted-color;
}

.has-focus {
  .uk-input, .uk-textarea, .uk-select {
    border:@global-border-width solid @color-a;
  }
}


.error-container {
  color:@color-warning;
}

.ipt-valid {
  color:@color-success;
}


.ipt-error {
  color:@color-warning;
}

.uk-input.ipt-error, .uk-textarea.ipt-error, .uk-select.ipt-error {
  border-color:@color-warning;
}



.uk-navbar-dropdown {
  .transition();
}

.uk-navbar-container, .eyecatcher-placeholder {
  min-height:@mobile-header-height;
}

.mobile-subnav-icon {
  margin-right:5px;
  vertical-align: 2px;
  display: inline-block;
}



#mobile-navigation {

  .level-1.starter_active {
    a.starter_active {
      .fontBold() !important;
    }
  }

  .level-2.active {
    .mobile-subnav-icon {
      display: inline-block;
    }
    > a {
      .fontMedium();
      color:@color-white !important;
    }
  }
}


//
// tablet portrait
//
@media (min-width: @breakpoint-small) {

  #short-message {
    position:fixed;
  }

}


//
// tablet landscape
//
@media (min-width: @breakpoint-medium) {

  .lang-navbar-container {
    padding:0 5px 0 25px;
  }

  /*
  #header,
  .uk-navbar-container,
  .uk-navbar-nav > li > a,
  .uk-navbar-item,
  .uk-navbar-toggle {
    height: @navbar-nav-item-height + 60;
  }

  .eyecatcher-placeholder {
    min-height:@navbar-nav-item-height + 60;
  }


  #header {
    .transition();
    //border-bottom:1px solid @global-border;
  }

  #header,
  .uk-navbar-container,
  .uk-navbar-nav > li > a,
  .uk-navbar-item,
  .uk-navbar-toggle {
    .transition();
  }

  .header-fixed-active {

    #header,
    .uk-navbar-container,
    .uk-navbar-nav > li > a,
    .uk-navbar-item,
    .uk-navbar-toggle {
      height: @navbar-nav-item-height !important;
      min-height: @navbar-nav-item-height !important;;
    }

  }
  */

}

//
// desktop
//
@media (min-width: @breakpoint-large) {

  .uk-light {
    #main-navigation.uk-navbar-nav > li.level-1 {
      > a {
        margin:0 25px;
      }
    }
  }

}

//
// large screens
//
@media (min-width: @breakpoint-xlarge) {


}


//
// crossbrowser fallback
//

.is-explorer {


}